<!--
  Copyright © 2015 Cask Data, Inc.
 
  Licensed under the Apache License, Version 2.0 (the "License"); you may not
  use this file except in compliance with the License. You may obtain a copy of
  the License at
 
  http://www.apache.org/licenses/LICENSE-2.0
 
  Unless required by applicable law or agreed to in writing, software
  distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
  WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
  License for the specific language governing permissions and limitations under
  the License.
--> 

<!DOCTYPE html>
<html lang="en" ng-strict-di>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <link rel="stylesheet" type="text/css" href="/assets/bundle/lib.css" />
    <link rel="stylesheet" type="text/css" href="/assets/bundle/app.css" />
</head>
<body class="theme-default">

  <header class="container">
    <h1>Directives' Playground</h1>
  </header>

  <hr />

  <div class="container" ng-init='timestamp=1345678912345'>

      <my-timestamp-picker
        ng-model="timestamp"
      ></my-timestamp-picker>

      <p ng-bind="timestamp"></p>
  </div>

  <hr />

  <div class="container" ng-init='logArr=[]'>

      <my-log-viewer
        data-model="logArr"
      ></my-log-viewer>

  </div>

  <hr />

  <div class="container" ng-init="testObj={metric:'whatever'}">

    <form class="form-horizontal" novalidate>

        <div class="form-group">
          <label class="col-xs-3 control-label">Metric</label>
          <div class="col-xs-9">


            <my-metric-picker
              ng-model="testObj.metric"
              required
            ></my-metric-picker>


          </div>
        </div>

    </form>

    <div class="row">
      <div class="col-xs-9 col-xs-offset-3">
        <pre ng-bind="testObj | json"></pre>
      </div>
    </div>

  </div>

  <script type="text/javascript" src="/assets/bundle/lib.js"></script>
  <script type="text/javascript" src="/config.js"></script>
  <script>
    angular.element(document).ready( function () {
      setTimeout(function(){
        console.debug('angular bootstrap');
        angular.bootstrap(document, [
          'cdap-ui.commons'
        ]);
      }, 1);
    });
  </script>
  <script type="text/javascript" src="/assets/bundle/app.js"></script>
  <script type="text/javascript" src="/assets/bundle/tpl.js"></script>
  <script type="text/javascript">
    if(location.host==='localhost:8080') {
      document.write('<script src="http://localhost'
        + ':35729/livereload.js"></' + 'script>');
    }
  </script>
</body>
</html>
